<template>
    <div class="other-link">
        <h2>{{ data.title }}</h2>
        <ul>
            <li v-for="(item, key) in data.items" :key="key">
                <router-link :to="'/article/' + item.id">
                    {{ item.title }}
                </router-link>
            </li>
        </ul>
    </div>
</template>
<script>
    export default {
        props: {
            data: Object,
        },
        name: "Links"
    }
</script>

<style lang="scss" scoped>
    .other-link {
        ul li {
            line-height: 24px;
            height: 24px;
            display: block;
            width: 40%;
            float: left;
            overflow: hidden;
            padding-left: 10px;
            background: url(../../../images/nav-line.jpg) no-repeat left center;
        }
        h2 {
            border-bottom: #000 2px solid;
            line-height: 40px;
            font-size: 14px;
            background: url(../../../images/book.png) left 10px center no-repeat;
            padding-left: 40px;
            color: #000;
        }
    }

</style>